<template>
    <div class="committee-box">
      <div class="getExpert">
        <el-button
          size="mini"
          type="primary"
          style="margin-left: 10px; margin-top: 10px"
          @click="extract"
          >抽取专家</el-button
        >
      </div>
      <div class="app-container" style="width: 1300px; margin: 20px auto">
        <el-table :data="successList" border>
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column
            label="专家编号"
            align="center"
            prop="expertCode"
            width="200px"
          />
          <el-table-column
            label="姓名"
            align="center"
            prop="expertName"
            width="120px"
          />
          <el-table-column label="性别" align="center" prop="gender" width="80px">
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.sys_user_sex"
                :value="scope.row.gender"
              />
            </template>
          </el-table-column>
          <el-table-column
            label="手机号"
            align="center"
            prop="phone"
            width="150px"
          />
          <el-table-column
            label="工作单位"
            align="center"
            prop="workUnit"
            width="240px"
          />
          <el-table-column label="通讯地址" align="center" prop="address" />
        </el-table>
  
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        />
      </div>
  
      <el-dialog
        title="抽取专家"
        :visible.sync="dialogVisible"
        width="70%"
        :before-close="handleClose"
      >
        <div class="title-box">抽取项目</div>
        <div style="width: 840px; margin: 0 auto">
          <el-table :data="bindItem" border>
            <!-- 添加序号列 -->
            <el-table-column
              label="序号"
              type="index"
              width="70"
              align="center"
              index-method="indexMethod"
            />
            <el-table-column label="项目编号" align="center" prop="bindCode" />
            <el-table-column label="项目名称" align="center" prop="bindName" />
            <el-table-column label="招标单位" align="center" prop="bindUnit" />
            <el-table-column label="业务类型" align="center" prop="busiType">
              <template slot-scope="scope">
                <dict-tag
                  style="margin-left: 15px"
                  :options="dict.type.business_type"
                  :value="scope.row.busiType"
                />
              </template>
            </el-table-column>
          </el-table>
        </div>
  
        <div class="open-box">
          <div class="title-box">抽取申请</div>
          <el-descriptions
            class="margin-top"
            style="margin: 20px auto; width: 840px"
            :column="2"
            :size="size"
            border
          >
            <el-descriptions-item>
              <template slot="label"> 抽取申请编号 </template>
              <div class="display-notice">
                <el-input
                  value="系统自动生成"
                  v-model="openBind.openCode"
                ></el-input>
              </div>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label"> 招标项目名称 </template>
              <div class="display-notice">
                <el-input v-model="openBind.bindName"></el-input>
              </div>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label"> 招标项目编号 </template>
              <div class="display-notice">
                <el-input v-model="openBind.bindCode"></el-input>
              </div>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label"> 专家确定方式 </template>
              <div class="display-notice">
                <el-radio
                  label="1"
                  style="margin-left: 20px"
                  v-model="random"
                  @change="randomExpert(1)"
                  :disabled="changeStatu"
                  >随机抽取</el-radio
                >
                <el-radio
                  label="2"
                  v-model="random"
                  @change="randomExpert(2)"
                  :disabled="changeStatu"
                  >直接指定</el-radio
                >
              </div>
            </el-descriptions-item>
  
            <el-descriptions-item>
              <template slot="label"> 评标开始时间 </template>
              <el-date-picker
                type="datetime"
                placeholder="选择日期时间"
                default-time="12:00:00"
                v-model="openBind.openTime"
              >
              </el-date-picker>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label"> 评标结束时间 </template>
              <el-date-picker
                type="datetime"
                placeholder="选择日期时间"
                default-time="12:00:00"
                v-model="openBind.endTime"
              >
              </el-date-picker>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label"> 开标地址 </template>
              <div class="display-notice">
                <el-input v-model="openBind.openPlance"></el-input>
              </div>
            </el-descriptions-item>
          </el-descriptions>
        </div>
        <div class="bind_header">采购方代表人</div>
        <div style="width: 840px; margin: 20px auto">
          <el-table :data="bindItem" border>
            <!-- 添加序号列 -->
            <el-table-column
              label="序号"
              type="index"
              width="70"
              align="center"
              index-method="indexMethod"
            />
            <el-table-column
              label="联系人"
              align="center"
              prop="bindHeader"
              width="120px"
            />
            <el-table-column
              label="联系方式"
              align="center"
              prop="phone"
              width="120px"
            />
            <el-table-column
              label="邮箱"
              align="center"
              prop="email"
              width="200px"
            />
            <el-table-column label="地址" align="center" prop="binderAddr" />
          </el-table>
        </div>
        <div v-show="show">
          <div class="bind_header">抽取条件设置</div>
          <el-button
            size="mini"
            type="primary"
            style="margin-left: 100px; margin-top: 20px"
            @click="openType"
            >新建</el-button
          >
          <el-button size="mini" type="success" @click="checkExpertList"
            >专家列表</el-button
          >
          <div style="width: 840px; margin: 20px auto">
            <el-table :data="extractionList" border>
              <!-- 添加序号列 -->
              <el-table-column
                label="序号"
                type="index"
                align="center"
                width="70"
                index-method="indexMethod"
              />
              <el-table-column
                label="评标专业"
                align="center"
                prop="bindHeader"
                width="300px"
              >
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.basic_expert_type"
                    :value="scope.row.type"
                    v-show="scope.row.type"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="抽取人数"
                align="center"
                prop="number"
                width="150px"
              />
              <el-table-column label="地区" align="center" prop="addr">
                <template slot-scope="scope">
                  <div>{{ scope.row.addr }}</div>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                align="center"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-edit"
                    @click="handleUpdate(scope.row, scope.$index)"
                    v-hasPermi="['expert:expert:edit']"
                    :disabled="changeStatu"
                    >修改</el-button
                  >
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-delete"
                    @click="handleDelete(scope.row, scope.$index)"
                    v-hasPermi="['expert:expert:remove']"
                    :disabled="changeStatu"
                    >删除</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <div class="bind_header">设置回避专家</div>
        <el-button
          size="mini"
          type="primary"
          style="margin-left: 100px; margin-top: 20px"
          @click="avoidExpert"
          :disabled="changeStatu"
          >添加</el-button
        >
        <div style="width: 840px; margin: 20px auto">
          <el-table :data="avoidExpertList" border>
            <!-- 添加序号列 -->
            <el-table-column
              label="序号"
              type="index"
              align="center"
              width="70"
              index-method="indexMethod"
            />
  
            <el-table-column
              label="姓名"
              align="center"
              prop="expertName"
              width="150px"
            />
            <el-table-column
              label="主评专业"
              align="center"
              prop="type"
              width="90px"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.basic_expert_type"
                  :value="scope.row.type"
                />
              </template>
            </el-table-column>
            <el-table-column label="联系方式" align="center" prop="phone" />
            <el-table-column label="工作单位" align="center" prop="workUnit" />
  
            <el-table-column
              label="操作"
              align="center"
              class-name="small-padding fixed-width"
            >
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="delAvoidExpert(scope.row, scope.$index)"
                  v-hasPermi="['expert:expert:remove']"
                  :disabled="changeStatu"
                  >删除</el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button
            type="primary"
            @click="submitOpenBind"
            v-show="openMessage.status < 5"
            >确 定</el-button
          >
        </span>
      </el-dialog>
  
      <el-dialog
        title="提示"
        :visible.sync="typeDialogVisibleTwo"
        width="50%"
        style="margin-top: 140px"
        :before-close="handleCloseAvoid"
      >
        <div>
          <span style="margin-right: 20px">评标专业:</span>
          <el-select
            v-model="type"
            clearable
            placeholder="请选择"
            @change="getType"
            v-show="changeSelect"
          >
            <el-option
              v-for="dict in dict.type.basic_expert_type"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
          <div>
            <span style="margin-right: 24px">抽取人数</span>
            <el-input-number
              v-model="number"
              :min="1"
              :max="10"
              style="width: 220px; margin-top: 20px"
            ></el-input-number>
  
            <!-- <el-input
              style="width: 220px; margin-top: 20px"
              v-model="number"
            ></el-input> -->
          </div>
          <div>
            <span style="margin-right: 20px">选择地区:</span>
            <el-select
              v-model="address"
              clearable
              placeholder="请选择"
              style="margin-top: 20px"
              @change="getProvice"
            >
              <el-option
                v-for="(item, index) in provincesArray"
                :key="index"
                :label="item"
                :value="item"
              />
            </el-select>
            <div>
              <el-descriptions
                class="margin-top"
                :column="1"
                :size="size"
                border
                style="margin-top: 20px"
              >
                <el-descriptions-item>
                  <template slot="label">
                    <i class="el-icon-tickets"></i>
                    已选择
                  </template>
                  <el-tag
                    v-for="tag in tags"
                    :key="tag.name"
                    closable
                    :type="tag.type"
                    @close="handleTagClose(tag)"
                  >
                    <span class="tab-item-box">{{ tag.name }}</span>
                  </el-tag>
                </el-descriptions-item>
              </el-descriptions>
            </div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            @click="saveExtraction"
            v-show="openMessage.status < 5"
            >确 定</el-button
          >
          <el-button @click="canselAvoid">取 消</el-button>
        </span>
      </el-dialog>
  
      <!--设置回避专家-->
      <el-dialog
        title="专家列表"
        :visible.sync="avoidDialogVisible"
        width="77%"
        :before-close="handleClosoAvoidVisible"
      >
        <div class="app-container" style="width: 1150px; margin: 0 auto">
          <el-table :data="toExpertList" border @row-dblclick="handleRowDblClick">
            <el-table-column
              label="姓名"
              align="center"
              prop="expertName"
              width="150px"
            />
            <el-table-column
              label="主评专业"
              align="center"
              prop="type"
              width="90px"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.basic_expert_type"
                  :value="scope.row.type"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="手机号"
              align="center"
              prop="phone"
              width="120px"
            />
  
            <el-table-column
              label="工作单位"
              align="center"
              prop="workUnit"
              width="240px"
            />
  
            <el-table-column label="所在区域" align="center" prop="address" />
          </el-table>
  
          <pagination
            v-show="total > 0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
          />
        </div>
  
        <span slot="footer" class="dialog-footer">
          <el-button @click="avoidDialogVisible = false">取 消</el-button>
          <el-button
            type="primary"
            @click="dialogVisible = false"
            v-show="openMessage.status < 5"
            >确 定</el-button
          >
        </span>
      </el-dialog>
  
      <!--查看专家列表-->
      <el-dialog
        title="提示"
        :visible.sync="checkDialogVisible"
        width="70%"
        :before-close="handleClose"
      >
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          v-show="showSearch"
          label-width="68px"
        >
          <el-form-item label="姓名" prop="expertName">
            <el-input
              v-model="queryParams.expertName"
              placeholder="请输入姓名"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="类型" prop="type">
            <el-select
              v-model="queryParams.type"
              placeholder="请选择类型"
              clearable
            >
              <el-option
                v-for="dict in dict.type.basic_expert_type"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="mini"
              @click="handleQuery"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
              >重置</el-button
            >
          </el-form-item>
        </el-form>
  
        <el-table :data="expertList" border style="margin: 0 auto">
          <el-table-column
            label="姓名"
            align="center"
            prop="expertName"
            width="150px"
          />
          <el-table-column
            label="主评专业"
            align="center"
            prop="type"
            width="140px"
          >
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.basic_expert_type"
                :value="scope.row.type"
              />
            </template>
          </el-table-column>
  
          <el-table-column
            label="手机号"
            align="center"
            prop="phone"
            width="130px"
          />
  
          <el-table-column
            label="工作单位"
            align="center"
            prop="workUnit"
            width="200px"
          />
  
          <el-table-column label="通讯地址" align="center" prop="address" />
        </el-table>
  
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        />
  
        <span slot="footer" class="dialog-footer">
          <el-button @click="checkDialogVisible = false">取 消</el-button>
          <el-button
            type="primary"
            @click="checkDialogVisible = false"
            v-show="openMessage.status < 5"
            >确 定</el-button
          >
        </span>
      </el-dialog>
    </div>
  </template>
  
  <script>
  import {
    listExpert,
    delExpert,
    cassExpertList,
    cassExpertListAdd,
    getExpert,
  } from "@/api/expert/expert";
  import {
    listOpenBind,
    getOpenBind,
    delOpenBind,
    addOpenBind,
    updateOpenBind,
  } from "@/api/purs/openBind";
  import {
    listAvoidExpert,
    getAvoidExpert,
    delAvoidExpert,
    addAvoidExpert,
    updateAvoidExpert,
    delAvoidExpertByExpertCode,
  } from "@/api/purs/avoidExpert";
  import {
    listCondition,
    getCondition,
    delCondition,
    addCondition,
    updateCondition,
  } from "@/api/purs/condition";
  import { updateBind } from "@/api/purs/bind";
  import {
    listBindExpert,
    getBindExpert,
    delBindExpert,
    addBindExpert,
    updateBindExpert,
    delBindExpertByExpertCode,
    delExpertBatch,
    clearExpertByBindCode,
    insertBindExpert,
  } from "@/api/purs/bindExpert";
  
  import { getPurCode } from "@/api/purs/purs";
  import axios from "axios";
  export default {
    name: "Expert",
    dicts: ["sys_user_sex", "business_type", "basic_expert_type"],
  
    props: {
      openMessage: {
        type: Object,
      },
    },
    data() {
      return {
        toExpertList: [],
        avoidDialogVisible: false,
        avoidExpertList: [],
        tags: [],
        changeStatu: true,
        address: "",
        typeDialogVisibleTwo: false,
        checkDialogVisible: false,
        type: "",
        changeSelect: true,
        value: "",
        mapData: [],
        addr: "",
        //省份
        province: "",
        //市
        cityList: [],
        city: "",
        //区
        areaList: [],
        area: "",
        number: "",
        openBind: {},
        dialogVisible: false,
        bindItem: [],
        // 遮罩层
        loading: true,
        random: "1",
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        successList: [],
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 专家管理表格数据
        expertList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          expertName: null,
          applStatus: null,
        },
        queryExpertParams: {
          pageNum: 1,
          pageSize: 10,
          expertName: null,
          type: null,
        },
        size: "",
        // 表单参数
        form: {},
        mapData: [],
        provincesArray: [],
        // 表单校验
  
        //抽取条件设置
        extraction: {},
        extractionList: [],
        arrList: [],
        test: "",
        msgCode: 1,
        updateIndex: 0,
        id: 0,
        bindExpertList: [],
        //抽取申请
        initExpertList: 1,
        conditionCode: "",
        expertBindArr: [],
        testArry: [],
        state: 0,
        show: true,
      };
    },
    created() {
      this.openBind.bindCode = this.openMessage.bindCode;
      this.openBind.bindName = this.openMessage.bindName;
      this.openBind.method = "1";
      this.bindItem = [];
      this.bindItem.push(this.openMessage);
      this.getList();
      this.init();
    },
  
    mounted() {
      if (this.openMessage.status > 4) {
        this.changeStatu = true;
      } else {
        this.changeStatu = false;
      }
      this.getCode();
      this.avoidExpertInit();
      this.cassExpertInit();
      this.toExpertList = this.testArry;
      this.openBindInit();
      this.evasionExpertList();
    },
    methods: {
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryExpertParams.pageNum = 1;
        this.getList();
      },
  
      //查看专家列表
      checkExpertList() {
        this.checkDialogVisible = true;
      },
  
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      //抽取信息初始化
      openBindInit() {
        getOpenBind(this.openMessage.bindCode).then((res) => {
          this.$set(this.openBind, "endTime", res.data.endTime);
          this.$set(this.openBind, "bindCode", res.data.bindCode);
          this.$set(this.openBind, "openCode", res.data.openCode);
          this.random = res.data.method;
          if (this.random == "1") {
            this.show = true;
          } else {
            this.show = false;
          }
          this.$set(this.openBind, "openPlance", res.data.openPlance);
          this.$set(this.openBind, "openTime", res.data.openTime);
        });
      },
  
      //专家筛选初始化
      avoidExpertInit() {
        let obj = {};
        this.extractionList = [];
        obj.bindCode = this.openMessage.bindCode;
        listCondition(obj).then((res) => {
          if (res.rows.length > 0) {
            res.rows.forEach((item) => {
              this.extractionList.push(item);
            });
          }
        });
      },
  
      //回避专家初始化
      evasionExpertList() {
        listAvoidExpert({
          bindCode: this.openMessage.bindCode,
        }).then((res) => {
          this.avoidExpertList = res.rows;
        });
      },
  
      //通过筛选专家
      cassExpertInit() {
        let obj = {};
        obj.bindCode = this.openMessage.bindCode;
        listBindExpert(obj).then((res) => {
          if (res.rows.length > 0) {
            this.expertBindArr = res.rows;
            this.toExpertList = [];
            this.testArry = [];
            res.rows.forEach((item) => {
              getExpert(item.expertCode).then((res) => {
                if (res.data != null) {
                  this.toExpertList.push(res.data);
                  this.successList.push(res.data);
                  this.testArry.push(res.data);
                }
              });
            });
          }
        });
      },
  
      submitOpenBind() {
        this.openBind.method = this.random;
        addOpenBind(this.openBind).then((res) => {
          if (res.code == 200) {
            this.successList = this.toExpertList;
            this.$modal.msgSuccess("操作成功");
            let bind = {
              bindCode: this.openMessage.bindCode,
              status: 4,
            };
  
            updateBind(bind).then();
          }
        });
  
        this.dialogVisible = false;
      },
  
      getCode() {
        let tableName = "pur_open_bind";
        getPurCode(tableName).then((response) => {
          this.openBind.openCode = response.data.encodeNow;
        });
      },
  
      canselAvoid() {
        this.typeDialogVisibleTwo = false;
      },
  
      delAvoidExpert(row, index) {
        let item = this.avoidExpertList[index];
        delAvoidExpertByExpertCode(row.expertCode);
        insertBindExpert({
          bindCode: this.openMessage.bindCode,
          expertCode: row.expertCode,
        });
        const flag = this.toExpertList.findIndex(
          (obj) => obj.expertCode === item.expertCode
        );
        if (flag === -1) {
          // 如果对象数组中不存在相同 id 的对象，则添加新对象
          this.toExpertList.push(item);
        } else {
          // 如果对象数组中已存在相同 id 的对象，则替换原有对象
          this.toExpertList.splice(index, 1, item);
        }
        this.avoidExpertList.splice(index, 1);
      },
  
      handleRowDblClick(row) {
        const index = this.toExpertList.findIndex(
          (obj) => obj.expertCode === row.expertCode
        );
  
        let obj = this.toExpertList[index];
        obj.bindCode = this.openMessage.bindCode;
        addAvoidExpert(obj);
        this.avoidExpertList.push(obj);
        this.toExpertList.splice(index, 1);
        delBindExpertByExpertCode(row.expertCode).then();
        this.avoidDialogVisible = false;
      },
  
      randomExpert(index) {
        this.test = "";
        this.tags = [];
        this.address = "";
        this.type = "";
        this.number = "";
        this.toExpertList = [];
        this.extractionList = [];
        this.avoidExpertList = [];
        clearExpertByBindCode(this.openMessage.bindCode);
        if (index == 1) {
          //随机抽取
  
          this.show = true;
        } else {
          //直接指定
          let arr = [];
          this.toExpertList = this.expertList;
          this.toExpertList.forEach((item) => {
            arr.push({
              bindCode: this.openMessage.bindCode,
              expertCode: item.expertCode,
            });
          });
          addBindExpert(arr);
          this.show = false;
        }
      },
  
      handleClosoAvoidVisible() {
        this.avoidDialogVisible = false;
      },
  
      avoidExpert() {
        this.avoidDialogVisible = true;
      },
      async handleDelete(row, index) {
        console.log("index:" + index);
        const loading = this.$loading({
          lock: true,
          text: "Loading",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)",
        });
  
        let obj = {};
        obj.type = row.type;
        obj.address = row.addr;
        // delCondition(row.conditionId).then((res) => {});
        let aaa = await delCondition(row.conditionId);
        this.extractionList.splice(index, 1);
        let test = [];
        await cassExpertList(obj).then((res) => {
          res.data.forEach((item) => {
            // delBindExpertByExpertCode(item.expertCode).then((res) => {});
            test.push(item.expertCode);
            if (this.toExpertList.length > 0) {
              const index = this.toExpertList.findIndex(
                (obj) => obj.expertCode === item.expertCode
              );
              if (index !== -1) {
                this.toExpertList.splice(index, 1);
              }
            }
  
            if (this.avoidExpertList.length > 0) {
              const successList = this.avoidExpertList.findIndex(
                (obj) => obj.expertCode === item.expertCode
              );
              if (successList !== -1) {
                this.avoidExpertList.splice(successList, 1);
              }
            }
          });
        });
  
        delExpertBatch(test).then((res) => {});
        setTimeout(() => {
          loading.close();
          this.$modal.msgSuccess("操作成功");
        }, 2000);
      },
  
      handleUpdate(row, index) {
        this.updateIndex = index;
        this.msgCode = 2;
        this.test = row.addr;
        this.type = row.type;
        this.conditionCode = row.conditionId;
        let addr = row.addr.split(",");
        addr.forEach((item) => {
          if (item != "") {
            this.tags.push({
              name: item,
              type: "success",
            });
          }
        });
        let updateItem = {};
        updateItem.type = this.type;
        updateItem.address = this.test;
  
        if (this.toExpertList.length > 0) {
          cassExpertList(updateItem).then((res) => {
            res.data.forEach((item) => {
              const index = this.toExpertList.findIndex(
                (obj) => obj.expertCode === item.expertCode
              );
              if (index !== -1) {
                this.toExpertList.splice(index, 1);
              }
            });
          });
        }
        this.test = "";
        this.tags = [];
        this.address = "";
        (this.number = ""), (this.typeDialogVisibleTwo = true);
      },
      handleCloseAvoid() {
        this.typeDialogVisibleTwo = false;
      },
  
      getProvice(value) {
        let foundDuplicate = false;
        let addr = value;
        if (this.extractionList.length > 0) {
          this.extractionList.forEach((item) => {
            const index = item.addr.indexOf(addr);
  
            if ((item.type == this.type) & (index !== -1)) {
              foundDuplicate = true;
              this.address = "";
              this.$modal.msgError("请勿重复选择");
              return;
            }
          });
        }
  
        if (!foundDuplicate) {
          const index = this.provincesArray.indexOf(value);
          if (index !== -1) {
            this.tags.push({
              name: this.address,
              type: "success",
            });
          }
          let addAddress = "";
          if (value.length == 3) {
            addAddress = value.substring(0, 2);
          } else {
            addAddress = value;
          }
          this.test = this.test + addAddress + ",";
        }
      },
  
      handleTagClose(tagToRemove) {
        // 在 tags 数组中移除对应的标签
        const index = this.tags.indexOf(tagToRemove);
        if (index !== -1) {
          this.tags.splice(index, 1);
        }
        this.test = "";
        this.tags.forEach((item) => {
          this.test = this.test + item.name + ",";
        });
      },
      saveExtraction() {
        this.state = this.state + 1;
        if (this.testArry.length > 0) {
          this.toExpertList = this.testArry;
        }
  
        if (
          this.type == "" ||
          this.number == "" ||
          this.tags.length == 0 ||
          this.conditionCode == ""
        ) {
          this.$modal.msgError("信息填充不完整");
        } else {
          const loading = this.$loading({
            lock: true,
            text: "正在随机抽取指定专家",
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)",
          });
          if (this.msgCode == 1) {
            this.id = this.id + 1;
            this.extraction.type = this.type;
            this.extraction.addr = this.test;
            let item = {};
            item.id = this.id;
            item.conditionId = this.conditionCode;
            item.type = this.type;
            item.addr = this.test;
            item.number = this.number;
            item.bindCode = this.openMessage.bindCode;
            this.extractionList.push(item);
  
            this.typeDialogVisibleTwo = false;
          } else {
            let obj = {};
            obj.addr = this.test;
            obj.type = this.type;
            obj.number = this.number;
            obj.conditionId = this.conditionCode;
            obj.id = this.id;
            obj.bindCode = this.openMessage.bindCode;
            let index = this.updateIndex;
            this.extractionList.splice(index, 1);
            this.extractionList.splice(index, 0, obj);
            this.typeDialogVisibleTwo = false;
          }
          let obj = {};
          obj.type = this.type;
          obj.address = this.test;
          obj.number = this.number;
          cassExpertListAdd(obj).then((res) => {
            if (res.data.length < obj.number) {
              const numberIndex = this.extractionList.findIndex(
                (obj) => obj.id === this.id
              );
              if (numberIndex !== -1) {
                this.extractionList[numberIndex].number = res.data.length;
              }
            }
  
            if (res.data.length < 1) {
              setTimeout(() => {
                loading.close();
                this.$modal.msgError("未找到指定专家");
                const conditionIndex = this.extractionList.findIndex(
                  (obj) => obj.conditionId === this.conditionCode
                );
                this.extractionList.splice(conditionIndex, 1);
              }, 1500);
            } else {
              res.data.forEach((item) => {
                const index = this.toExpertList.findIndex(
                  (obj) => obj.expertCode === item.expertCode
                );
  
                if (index === -1) {
                  // 如果对象数组中不存在相同 id 的对象，则添加新对象
                  this.toExpertList.push(item);
                } else {
                  // 如果对象数组中已存在相同 id 的对象，则替换原有对象
                  this.toExpertList.splice(index, 1, item);
                }
              });
  
              addCondition(this.extractionList).then((res) => {});
              this.bindExpertList = [];
  
              this.toExpertList.forEach((item) => {
                let obj = {};
                obj.bindCode = this.openMessage.bindCode;
                obj.expertCode = item.expertCode;
                this.bindExpertList.push(obj);
              });
  
              addBindExpert(this.bindExpertList).then((res) => {});
  
              setTimeout(() => {
                loading.close();
                this.$modal.msgSuccess("随机抽取完成");
              }, 2400);
            }
          });
  
          setTimeout(() => {
            loading.close();
          }, 2400);
          this.test = "";
          this.tags = [];
          this.address = "";
          this.type = "";
          this.number = "";
        }
      },
  
      init() {
        axios.get("/area.json").then((response) => {
          this.mapData = response.data;
          let index = 0;
          for (let provinceId in this.mapData) {
            index = parseInt(index) + 1;
            if (this.mapData.hasOwnProperty(provinceId)) {
              this.provincesArray.push(this.mapData[provinceId].n);
            }
          }
        });
      },
      //专家筛选编码
      getExpertTjCode() {
        let tableName = "pur_condition";
        getPurCode(tableName).then((response) => {
          this.conditionCode = response.data.encodeNow;
        });
      },
  
      openType() {
        this.initExpertList = this.initExpertList + 1;
        if (this.initExpertList == 2) {
          this.toExpertList = [];
        }
        this.getExpertTjCode();
        this.msgCode = 1;
        this.typeDialogVisibleTwo = true;
      },
      getType() {
        console.log(1);
      },
      extract() {
        this.dialogVisible = true;
      },
  
      details(row) {
        this.$router.push("/basic/details");
      },
      handleClose() {
        this.dialogVisible = false;
      },
      indexMethod(index) {
        // 根据需要自定义序号生成方式，这里只是简单返回索引+1
        return index + 1;
      },
  
      /** 查询专家管理列表 */
      getList() {
        listExpert(this.queryParams).then((response) => {
          this.expertList = response.rows;
          this.total = response.total;
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          expertId: null,
          expertName: null,
          gender: null,
          idCard: null,
          phone: null,
          email: null,
          health: null,
          workUnit: null,
          retired: null,
          address: null,
          bank: null,
          bankAccountNumber: null,
          idCardFile: null,
          papersFile: null,
          applStatus: null,
        };
        this.resetForm("form");
      },
    },
  };
  </script>
  <style scoped>
  .title-box {
    margin: 15px;
    margin-left: 90px;
    font-family: "仿宋";
    font-weight: bold;
    font-style: italic;
    font-size: 17px;
    color: black;
  }
  
  .el-select-dropdown {
    border: 1px solid #48e3ff;
  }
  
  .el-select-dropdown .el-select-dropdown__item {
    /* 设置字体颜色为黑色 (#333) */
    color: #409eff; /* 修改激活时的字体颜色 */
    font-weight: bold;
  }
  
  .bind_header {
    margin-top: 30px;
    margin-left: 90px;
    font-style: italic;
    font-family: "仿宋";
    color: black;
    font-weight: bold;
    font-size: 17px;
  }
  
  .pb-box {
    background-image: url("../../image/搜索.png");
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: 20px center;
  }
  
  .pb-box:hover {
    opacity: 0.6;
    cursor: pointer;
  }
  
  .tab-box {
    width: 300px;
    margin-top: 40px;
    border: 1px solid red;
    height: 200px;
  }
  
  .tag-container {
    margin-top: 20px;
    width: 400px;
    display: flex;
    justify-content: space-between; /* 调整标签之间的距离 */
  }
  </style>
  